<link rel="stylesheet" href="templates/authority/common/css/zTreeStyle.css" />
<link rel="stylesheet" href="templates/authority/qxgl/css/qxgl.css" />
<link rel="stylesheet" href="templates/authority/sendedMessage/css/sendedMsg.css" />
<div id="sendedmessage" style="height: 100%;">
    <div class="pd14 vany_authority">
        <div class="vany_treeTable pd14">
            <div class="pb10" id="crumbs">
                <el-breadcrumb separator="/">
                    <el-breadcrumb-item :to="{ path: '/' }">消息管理</el-breadcrumb-item>
                    <el-breadcrumb-item>已发消息</el-breadcrumb-item>
                </el-breadcrumb>
            </div>
            <div >
                <div class="pd14" style="border-bottom: 0">
                    <el-row :gutter="8">
                        <el-col :span="16">
                            <el-form :inline="true"  class="demo-form-inline">
                                <el-form-item label="发送时间：" style="margin-bottom: 0px">
                                    <el-date-picker type="daterange" placeholder="请选择时间段"  v-model="time" style="width: 100%;border-radius: 0px"></el-date-picker>
                                </el-form-item>
                                <el-form-item label="关键词：" style="margin-bottom: 0px" >
                                    <el-input placeholder="请输入关键词" style="border-radius: 0px" v-model="keyword"></el-input>
                                </el-form-item>
                                <el-form-item style="margin-bottom: 0px">
                                    <el-button  @click="search()">搜索</el-button>
                                </el-form-item>
                            </el-form>
                        </el-col>
                        <el-col :span="8">
                            <el-row type="flex" justify="end">
                                <el-button type="primary" @click="sendMessage()">发消息</el-button>
                            </el-row>
                        </el-col>
                    </el-row>
                </div>
                <div class="pd14" style="padding-top: 0;border-top: 0">
                    <el-table :data="tableData" :resizable="true" v-loading="loading" element-loading-text="拼命加载中" style="width:100%;" ref="multipleTable" @selection-change="handleSelectionChange">
                        <el-table-column type="selection"></el-table-column>
                        <el-table-column prop="msgtitle" show-overflow-tooltip label="消息标题"></el-table-column>
                        <el-table-column prop="receivers" show-overflow-tooltip label="接收人"></el-table-column>
                        <el-table-column label="查看人数/总人数/查看比例" width="250">
                            <template scope="scope">
                                <el-row :gutter='4'>
                                    <el-col :span='3'>
                                            {{scope.row.statistic.num}}
                                    </el-col>
                                    <el-col :span='14' style='margin-top: 4px'>
                                        <el-progress id='progress' style='line-height:0' :text-inside='true' :stroke-width='15' :percentage='scope.row.statistic.rate'></el-progress>
                                    </el-col>
                                </el-row>
                            </template>
                        </el-table-column>
                        <el-table-column prop="sendTime" label="发送时间" width="250"></el-table-column>
                        <el-table-column label="操作" width="250">
                            <template scope="scope">
                                <el-button type="text" size="small" @click="getMsgDetail(scope.row)">查看</el-button><span style="color:#333;margin:0 5px 0 5px">|</span>
                                <el-button type="text" size="small" @click="statisticMsg(scope.row)">统计</el-button>
                            </template>
                        </el-table-column>
                    </el-table>
                    <el-row class="msg-pagination">
                        <el-col :span="8">
                            <el-button type="primary" @click="batchDelete()">批量删除</el-button>
                        </el-col>
                        <el-col :span="16">
                            <el-row type="flex" justify="end">
                                <el-pagination
                                        @size-change="handleSizeChange"
                                        @current-change="handleCurrentChange"
                                        :current-page="pageIndex"
                                        :page-sizes="[10, 20, 30]"
                                        :page-size="pageSize"
                                        layout="total, sizes, prev, pager, next, jumper"
                                        :total="total">
                                </el-pagination>
                            </el-row>
                        </el-col>
                    </el-row>
                </div>
            </div>
        </div>
    </div>
</div>
</div>
<script type="text/javascript" src="templates/authority/sendedMessage/js/sendedmessage.js"></script>


